<template>
  <div class="setting-box">
    <!-- 邀请审核 -->
    <div class="menu-item">
      <div class="menu-item-left">
        <p class="setting-title1">邀请审核</p>
        <span class="setting-title2">开启后，成员加入展览需要展览创建人审核</span>
      </div>
      <div class="hw-box-end-box hw-box-style-flex-r-center">
        <span class="switch-span">{{ parmas.invitation ? '已开启' : '未开启' }}</span>
        <t-switch v-model="parmas.invitation" @change="oninvitation" :disabled="props.role !== 1" />
      </div>
    </div>
    <!-- 开启留言 -->
    <div class="menu-item">
      <div class="menu-item-left">
        <p class="setting-title1">开启留言</p>
        <span class="setting-title2">开启留言后，平台注册用户可对展览进行留言</span>
      </div>
      <div class="hw-box-end-box hw-box-style-flex-r-center">
        <span class="switch-span">{{ parmas.Leaving ? '已开启' : '未开启' }}</span>
        <t-switch v-model="parmas.Leaving" @change="onChange" :disabled="props.role !== 1" />
      </div>
    </div>
    <!-- 展览移交 -->
    <div class="menu-item">
      <div class="menu-item-left">
        <span class="setting-title1">展览移交</span>
        <span class="setting-title2">展览的「创建人」权限移交权限后将转变为展览的「策展人」</span>
      </div>
      <div class="hw-box-end-box hw-box-style-flex-r-center">
        <t-button variant="outline" @click="visibleMode = true">移交</t-button>
      </div>
    </div>
    <!-- 展览删除 -->
    <div class="menu-item">
      <div class="menu-item-left">
        <span class="setting-title1">展览删除</span>
        <span class="setting-title2">删除展览，将同时删除归属于该展览的所有内容</span>
      </div>
      <div class="hw-box-end-box hw-box-style-flex-r-center">
        <t-button variant="outline" @click="visible1 = true">删除展览</t-button>
      </div>
    </div>

    <moveDialog :visible="visibleMode" @close="close" @moveClose="moveClose" />
    <messageModel
      submitText="删除"
      title="提示"
      :visible="visible1"
      problem="确定删除此展览？"
      message="删除后可在回收站找回"
      @closeClick="closeClick"
      @submitClick="submitClick"
    />
  </div>
</template>

<script setup lang="ts">
// @ts-nocheck
import moveDialog from './moveDialog.vue';
import { MessagePlugin } from 'tdesign-vue-next';
import { SettingType } from '@/api/model/project';
import messageModel from '@/components/messageModel/index.vue';
import { settings, addsettings, transfer, projectDisable } from '@/api/project/project';
import { reactive, ref } from 'vue';
import { useRouter } from 'vue-router';
import { overview, projectRole } from '@/api/project/project';
import { useProjectStore, useUserStore } from '@/store';

const store = useProjectStore();
const userstore = useUserStore();
const router = useRouter();
const props = defineProps({
  role: {
    type: Number,
  },
});
const loading = ref(false);
const visible1 = ref(false);
const visibleMode = ref(false);
const parmas = reactive({
  Leaving: false,
  invitation: false,
});

const init = async () => {
  try {
    let res = await settings(localStorage.getItem('projectId'));
    res.data.forEach((element) => {
      if (element.type === 1) {
        parmas.invitation = element.config ? true : false;
      }
      if (element.type === 2) {
        parmas.Leaving = element.config ? true : false;
      }
    });
    console.log(res.data);
  } catch {}
};
const settingUpdata = async (from: Array<SettingType>, type: number) => {
  try {
    loading.value = true;
    let res = await addsettings(localStorage.getItem('projectId'), from);
    if (res.statusCode !== 200) {
      MessagePlugin.error('操作失败');
    }
    loading.value = false;
  } catch {
    loading.value = false;
  }
};
const onChange = () => {
  if (loading.value) {
    return;
  }
  settingUpdata([{ config: parmas.Leaving, type: 2 }], 2);
  //留言开关
};
const oninvitation = () => {
  //邀请审核操作开关
  if (loading.value) {
    return;
  }
  settingUpdata([{ config: parmas.invitation, type: 1 }], 1);
};

const closeClick = () => {
  //点击关闭
  visible1.value = false;
};
const submitClick = async () => {
  try {
    let res = await projectDisable(localStorage.getItem('projectId'));
    if (res.statusCode == 200) {
      MessagePlugin.success('删除成功');
      router.push('/project/HwProject');
    }
    visible1.value = false;
  } catch {}
  //点击删除
};
const close = () => {
  visibleMode.value = false;
};
const getRole = async () => {
  //重置展览角色
  try {
    let res = await projectRole(localStorage.getItem('projectId'));

    store.setProjectRole(res.data);
    // console.log();
  } catch {}
};
const moveClose = (e: number) => {
  if (e) {
    transfer(localStorage.getItem('projectId'), e).then((res) => {
      if (res.statusCode == 200) {
        MessagePlugin.success('移交成功');
        getRole();
      } else {
        MessagePlugin.error('操作失败');
      }
      visibleMode.value = false;
    });
  } else {
    visibleMode.value = false;
  }
  console.log(e);
};
init();
</script>

<style lang="less" scoped>
.menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding-bottom: 24px;
  margin-bottom: 24px;
  box-shadow: inset 0px -1px 0px 0px #f0f0f0;
}
.menu-item-left {
  display: flex;
  flex-direction: column;
  width: 70%;
}
.hw-box-end-box {
  display: flex;
  justify-content: flex-end;
  flex: 1;
}
// .setting-left {
//   font-family: PingFangSC-Regular, PingFang SC;
// }
.setting-title1 {
  font-size: 14px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.38);
  line-height: 22px;
  margin-bottom: 8px;
}
// .hw-box-end-box {
//   span {
//     font-size: 12px;
//     color: rgba(0, 0, 0, 0.6);
//     line-height: 17px;
//     margin-right: 4px;
//   }
// }
.setting-title2 {
  font-size: 16px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.8);
  line-height: 24px;
}
.switch-span {
  font-size: 16px;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.8);
  line-height: 24px;
  margin-right: 8px;
}
// .t-row {
//   padding: 32px 0;
//   margin-top: 0;
//   box-shadow: inset 0px -1px 0px 0px rgba(230, 230, 230, 0.5);
// }
</style>
